<template>
  <div class="input_big_box">
    <div class="title_box">
      <div class="title">{{ title }}</div>
    </div>
    <div class="inp_content_box">
      <div class="input">
        <input
          v-model="inpValue"
          :type="type"
          :placeholder="placeholder || $t('page.doc104')"
          :disabled="disabled"
          :maxlength="maxlength"
        />
      </div>
      <div class="inp_right">
        <div class="eye" @click="changeType">
<!--          <img :src="require(`@/assets/images1/common/icon-eye-${type == 'password' ? 'close' : 'open'}.png`)" alt=""/>-->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import input_mixins from './input_mixins';

export default {
  mixins: [input_mixins],

  props: {
    areaId: [Number, String],
    isNumber:{
      type: Boolean,
      default: false
    },
    isNoSpace:{
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      type: 'password',
    };
  },
  methods: {
    changeType() {
      this.type = this.type == 'password' ? 'text' : 'password';
    },
  },
};
</script>

<style lang="less" scoped>
@import './index';

.eye {
  width: 0.4rem;
}
</style>
